<script>
import weather from './weather.vue'
import axios from 'axios'
axios.defaults.baseURL = 'http://10.181.0.137:8080/'
export default {
  components: { weather },
  data () {
    return {
      city: '',
      res: []
    }
  },
  methods: {
    searchEvent () {
      const theCity = this.$refs.searchCity.value
      console.log(theCity)
      axios
        .get(
          '/api/query?city=' + theCity + '&key=594cf24c8a7b4c4d56de72d5296b85df'
        )
        .then((res) => {
          if (res.data.result) {
            this.res = res.data.result.future
          } else {
            this.res = []
            alert('城市不存在')
          }
          this.city = theCity
          console.log(res)
        })
    }
  }
}
</script>

<template>
  <input type='text' ref='searchCity' />
  <button @click='searchEvent'>查询</button>
  <!-- weather绑定 :city，向子组件传city的值 并且子组件中用props{city}获取传值-->
  <weather :city='city' :res='res'></weather>
  <weather :city='city' :res='res'></weather>
</template>
